<div class="preView">
  <div class="card1" *ngIf="this.nodes.length>0">
    <div class="flow-nodes" *ngFor="let node of nodes; let i = index">
      <div class="node">
        <div class="text" *ngIf="i==0">
          <span>首序</span>
        </div>
        <div class="text" *ngIf="i==nodes.length-1&&i!=0">
          <span>末序</span>
        </div>
        <app-process-node [delete]="false" [details]="true" [node]="node" (click)="nodeClick(node)" [isClicked]="node.isClicked">
        </app-process-node>
      </div>
      <div class="puls-item" *ngIf="i < nodes.length - 1">
        <div class="long-arrow"></div>
      </div>
    </div>
  </div>
  <div class="card1" *ngIf="this.nodes.length==0">
    <div class="flow-nodes">
      <h3>未配置MOM</h3>
    </div>
  </div>
  <div class="input-g">
    <div class="input-group">
      <d-tabs [type]="'tabs'" [activeTab]="tabActiveId">
        <d-tab id="工序" title="工序">
          <d-data-table  [dataSource]="this.selectNode"
            [scrollable]="true"
            [fixHeader]="true" [maxHeight]="maxHeight" [tableWidthConfig]="devuiTableWidthConfig">
            <thead dTableHead>
              <tr dTableRow>
                <th dHeadCell>工序序号 </th>
                <th dHeadCell>工序编码</th>
                <th dHeadCell>工序名称</th>
                <th dHeadCell>单位工时</th>
                <th dHeadCell>委外/自制</th>
                <th dHeadCell>检验</th>
              </tr>
            </thead>
            <tbody dTableBody >
              <ng-template let-rowItem="rowItem" let-rowIndex="rowIndex">
                <tr dTableRow>
                  <td dBodyCell><span dTooltip [content]="rowItem?.processNumber">{{rowItem.processNumber}}</span></td>
                  <td dBodyCell>
                    <span dTooltip [content]="rowItem.processNum">{{rowItem.processNum}}</span>
                  </td>
                  <td dBodyCell>
                    <span dTooltip [content]="rowItem.processName">{{rowItem.processName}}</span>
                  </td>
                  <td dBodyCell>
                    <span dTooltip [content]="rowItem.unitTime">{{rowItem.unitTime}}</span>
                  </td>
                  <td dBodyCell>
                    <d-tag dTooltip [content]="rowItem.isOutsourcing ? '委外' : '自制'" [tag]="rowItem.isOutsourcing ? '委外' : '自制'" [labelStyle]="rowItem.isOutsourcing ? 'tag-custom2' : 'tag-custom'"></d-tag>
                  </td>
                  <td dBodyCell>
                    <d-tag *ngIf="rowItem.isFirstInspection" dTooltip [content]="'首检'" [tag]="'首检'" [labelStyle]="rowItem.isFirstInspection ? 'tag-custom1' : 'tag-custom'" class="me-2"></d-tag>
                    <d-tag *ngIf="rowItem.isnspection" dTooltip [content]="'检验'" [tag]="'检验'" [labelStyle]="rowItem.isInspection ? 'tag-custom1' : 'tag-custom'"></d-tag>
                  </td>
                </tr>
              </ng-template>
            </tbody>
          </d-data-table>
        </d-tab>
        <d-tab id="物料" title="物料">
          <d-data-table  [dataSource]="this.MaterialTableData"  [tableOverflowType]="'overlay'"
            [scrollable]="true"
            [fixHeader]="true" [maxHeight]="maxHeight" [tableWidthConfig]="devuiTableWidthConfig2">
            <thead dTableHead>
              <tr dTableRow>
                <th dHeadCell>物料序号</th>
                <th dHeadCell>物料编码</th>
                <th dHeadCell>物料名称</th>
                <th dHeadCell>物料规格</th>
                <th dHeadCell>物料单位</th>
                <th dHeadCell>单位用量</th>
                <th dHeadCell>损耗率%</th>
                <th dHeadCell>固定损耗</th>
              </tr>
            </thead>
            <tbody dTableBody >
              <ng-template let-rowItem="rowItem" let-rowIndex="rowIndex">
                <tr dTableRow>
                  <td dBodyCell>
                    <span dTooltip [content]="rowItem.partNumber">{{rowItem.partNumber}}</span>
                  </td>
                  <td dBodyCell>
                    <span dTooltip [content]="rowItem.partNum">{{rowItem.partNum}}</span>
                  </td>
                  <td dBodyCell>
                    <span dTooltip [content]="rowItem.partName">{{rowItem.partName}}</span>
                  </td>
                  <td dBodyCell>
                    <span dTooltip [content]="rowItem.partType">{{rowItem.partType}}</span>
                  </td>
                  <td dBodyCell>
                    <span dTooltip [content]="rowItem.partUOM">{{rowItem.partUOM}}</span>
                  </td>
                  <td dBodyCell>
                    <span dTooltip [content]="rowItem.unitUsage">{{rowItem.unitUsage}}</span>
                  </td>
                  <td dBodyCell>
                    <span dTooltip [content]="rowItem.lossRate">{{rowItem.lossRate}}</span>
                  </td>
                  <td dBodyCell>
                    <span dTooltip [content]="rowItem.fixedLoss">{{rowItem.fixedLoss}}</span>
                  </td>
                </tr>
              </ng-template>
            </tbody>
          </d-data-table>

        </d-tab>
      </d-tabs>

    </div>
  </div>

</div>


